<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>背景属性</title>
		<style>
			bod y{
				
				height:100000000px;
				background-image: url(img/雏田.png);
				background-size: cover;
				/* 函数 cover 等比例放大图片  特点：图片按照比例放大存背景空间
				【开发者：背景图大小是否等于背景空间】
				    contain   等比例缩放图片  特点：图片按照比例缩放存背景空间
				【开发者：背景图等比例显示在背景空间】		
					*/
					   
					   /* 背景附件-尺寸中存在cover或者contain */
					   background-attachment:fixed;/*背景图固定   scroll 背景图不固定*/
							   
					}
			div{
				width: 300px;
				height: 1000px;
				background-color: #e4393c;
				background: lightpink;
				background-image: url(img/雏田.png);
				/* 问题：超大图-不显示  小图-显示
				 注意：背景空间大小，如果小于背景空间---平铺
				 */
				background-repeat:no-repeat;
				/*不平铺 repeat-x，y横、纵向平铺*/
				background-size: 30%;
				/* 背景尺寸属性值：数值px % | 函数 cover contain */
				/*背景定位：前提背景空间大于背景图 关键字 center、left、right、top、bottom*/
				background-position:80% 0;
			}
		</style>
	</head>
	<body>
		Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis aliquid cum quis quae maxime? Rem quidem earum tempore molestiae adipisci assumenda cum error harum animi perferendis, hic accusamus veritatis labore.
		Lorem ipsum dolor sit amet consectetur adipisicing elit. Asperiores vitae porro eum? Officiis ducimus, modi deleniti cum ipsam perferendis illo nobis, dignissimos quibusdam consequuntur minima cumque consectetur. Pariatur, aut porro.
		Lorem ipsum dolor, sit amet consectetur adipisicing elit. Rerum neque quae non ullam, ipsum nemo totam ex sed soluta sequi eum modi dolorum voluptate voluptatem molestiae maiores asperiores distinctio. Ducimus!
		
		<!-- html img图片 引入一张图片，位置不可随意改变
		     css  背景图片  引入一张图片，位置可以随意改变
			 子属性 background-color  背景颜色
			    background-image      背景图
				background-repeat     背景重复
				background-size       背景尺寸
				background-attachment 背景附件
				background-position   背景定位
			 复合属性 background:background-image background-color background-position 
			          background-size background-repeat和background-attachment
			 简写属性 background：background-image background-position|background-size background-repeat
			替代子属性background-image、background-color、background-repeat
			 
		 -->
		<div></div>
	</body>
</html>